import React from 'react'
import { Tabs } from 'antd'
import styles from '../index.module.css'
import DoctorCard from './DoctorCard'
import HospitalCard from './HospitalCard'
import DrugCard from '../../../conpoment/DrugCard'

export interface SearchResultsProps {
  activeTab: string
  list: any[]
  loading: boolean
  error: string | null
  doctorData: any[]
  socoData: any[]
  onChange: (key: string) => void
}

const SearchResults: React.FC<SearchResultsProps> = ({ activeTab, list, loading, error, doctorData, socoData, onChange }) => {
  const items = [
    {
      key: '1',
      label: '综合',
      children: <div className={styles.comprehensiveResults}>
        {loading && (
          <div className={styles.loading}>搜索中...</div>
        )}
        {error && (
          <div className={styles.errorMessage}>{error}</div>
        )}
        {!loading && !error && list.length === 0 && (
          <div className={styles.noResults}>
            未找到相关结果
          </div>
        )}
        {!loading && !error && list.length > 0 && (
          <>
            <div className={styles.resultsList}>
              {list.map((item, index) => {
                if (item.type === 'doctor' || doctorData.includes(item)) {
                  return <DoctorCard key={item.id || index} doctor={item} index={index} />
                }
                return null
              })}
            </div>
          </>
        )}
      </div>,
    },
    {
      key: '2',
      label: '科普',
      children: <div className={styles.articleResults}>
        {loading && (
          <div className={styles.loading}>搜索中...</div>
        )}
        {error && (
          <div className={styles.errorMessage}>{error}</div>
        )}
        {!loading && !error && list.length === 0 && (
          <div className={styles.noResults}>
            未找到相关科普文章
          </div>
        )}
        {!loading && !error && list.length > 0 && (
          <div className={styles.resultsList}>
            {list.map((item, index) => (
              <div key={index} className={styles.articleCard}>
                <h3>{item.texttitle}</h3>
                <p>{item.textdise}</p>
                <div className={styles.articleMeta}>
                  <span>阅读量: {item.textdoctor}</span>
                </div>
              </div>
            ))}
          </div>
        )}
      </div>,
    },
    {
      key: '3',
      label: '医生',
      children: <div className={styles.doctorResults}>
        {loading && (
          <div className={styles.loading}>搜索中...</div>
        )}
        {error && (
          <div className={styles.errorMessage}>{error}</div>
        )}
        {!loading && !error && list.length === 0 && (
          <div className={styles.noResults}>
            未找到相关医生
          </div>
        )}
        {!loading && !error && list.length > 0 && (
          <div className={styles.resultsList}>
            {list.map((item, index) => {
              if (item.type === 'doctor' || doctorData.includes(item)) {
                return <DoctorCard key={item.id || index} doctor={item} index={index} />
              }
              return null
            })}
          </div>
        )}
      </div>,
    },
    {
      key: '4',
      label: '医院',
      children: <div className={styles.hospitalResults}>
        {loading && (
          <div className={styles.loading}>搜索中...</div>
        )}
        {error && (
          <div className={styles.errorMessage}>{error}</div>
        )}
        {!loading && !error && socoData.length === 0 && list.length === 0 && (
          <div className={styles.noResults}>
            未找到相关医院
          </div>
        )}
        {!loading && !error && (socoData.length > 0 || list.length > 0) && (
          <div className={styles.resultsList}>
            {/* 优先显示soco数据（专门的医院数据） */}
            {socoData.length > 0 ? (
              socoData.map((hospital, index) => (
                <HospitalCard 
                  key={hospital.id || `soco-${index}`} 
                  hospital={hospital} 
                  index={index} 
                />
              ))
            ) : (
              /* 如果没有soco数据，显示list中的医院数据 */
              list.map((item, index) => {
                // 判断是否为医院数据
                if (item.type === 'hospital' || item.hospitalName || item.socoadmin || item.nosocomium) {
                  return (
                    <HospitalCard 
                      key={item.id || index} 
                      hospital={item} 
                      index={index} 
                    />
                  )
                }
                return null
              })
            )}
          </div>
        )}
      </div>,
    },
    {
      key: '5',
      label: '药品',
      children: <div className={styles.medicineResults}>
        {loading && (
          <div className={styles.loading}>搜索中...</div>
        )}
        {error && (
          <div className={styles.errorMessage}>{error}</div>
        )}
        {!loading && !error && list.length === 0 && (
          <div className={styles.noResults}>
            未找到相关药品
          </div>
        )}
      </div>,
    },
  ]
  return (
    <Tabs defaultActiveKey={activeTab || '1'} items={items} onChange={onChange} />
  )
}
export default SearchResults